import { Meteor } from 'meteor/meteor';
import { Template } from 'meteor/templating';
import { ReactiveDict } from 'meteor/reactive-dict';

import './main.html';
import '../imports/ui/task.js';
import '../imports/startup/accounts-config.js';

import { Tasks } from '../imports/api/tasks.js';

Template.body.onCreated(function bodyOnCreated() {
	this.state = new ReactiveDict();
	Meteor.subscribe('tasks');
});

Template.body.helpers({
	tasks() {
		const instance = Template.instance();
		if (instance.state.get('hideCompleted')) {
			return Tasks.find({ checked: { $ne: true } }, { sort: {createAt: -1} });
		}
		return Tasks.find({}, {sort: { createAt: -1 }});
	},
	incompleteCount() {
		return Tasks.find( { checked: { $ne: true } }).count();
	}
});

Template.body.events({
	'submit .new-task'(event) {
		event.preventDefault();

		const target = event.target;
		const text = target.text.value;

		Meteor.call('tasks.insert', text);

		target.text.value = '';
	},
	'change .hide-completed input'(event, instance) {
		instance.state.set('hideCompleted', event.target.checked);
	}
});
